<!DOCTYPE html>
<html lang="zh-CN">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <meta name="description" content="">
        <meta name="keywords" content="">
        <title>lg</title>
       
    </head>
    <body>
            <p>
                <input class="ui-input" id="msg" name="value" value="发送" required>
                <input class="ui-button" type="button" id="sendBtn" value="发送">
                <div id="show"></div>
            </p>
        <script>
            if ("WebSocket" in window) {
                // 弹幕数据
                var wsServer = 'ws://192.168.1.28:9501';
                var ws = new WebSocket(wsServer);

                ws.onopen = function (evt) {
                    if (ws.readyState == 1) {
                        console.log('WebSocket 连接成功...');
                    } else {
                        console.log('WebSocket 连接失败...');
                    }
                };

                ws.onmessage = function (evt) {
                    console.log('Retrieved data from server: ' + evt.data);
                    // barrage.add({
                    //     value: evt.data,
                    //     time: eleVideo.currentTime,
                    //     speed: 5,
                    //     color: itemsColor[Math.floor(Math.random()*itemsColor.length)]

                    //     // 其它如 fontSize, opacity等可选
                    // });
                    //var show = document.getElementById('show');
                    //show.innerHTML = "xxx";
                    show.innerHTML = "xxx";

                    console.log('Retrieved data from server: ' + evt.data);
                };

                ws.onerror = function (evt) {
                    alert('WebSocket 发生错误');
                    console.log(evt);
                };

                ws.onclose = function() {
                    alert('WebSocket 连接关闭');
                    console.log('WebSocket 连接关闭...');
                };

                var msg;
                var sendBtn = document.getElementById('sendBtn');
                sendBtn.onclick = function(){
                    if (ws.readyState == 1) {
                        msg = document.getElementById('msg').value;
                        ws.send(msg);
                        console.log('sendBtn');
                    } else {
                        alert('WebSocket 连接失败');
                    }
                };
            } else {
                alert("您的浏览器不支持 WebSocket!");
            }
            </script>
    </body>
</html>
